<template>
  <div class="reportFormPage">
    <TopOperation ref="TopOperation" :tabs-list="tabList" :active-val.sync="activeVal" @currentActive="currentActive"
      @reportFormsSubmit="reportFormsSubmit" @printSpecificPart="onPrintSpecificPart" />
    <div ref="printView" v-loading="modPagesLodding">
      <div v-show="activeVal === 'tdmdjlb'" v-for="(item, index) in excelTypeMap['tdmdjlb']" :key="'tdmdjlb' + index">
        <tdmdjlb ref="tdmdjlb" :excel-id="item" :page="index" :syType="form.syType"></tdmdjlb>
      </div>
      <div v-show="activeVal === 'gzsdjlb'" v-for="(item, index) in excelTypeMap['gzsdjlb']" :key="'gzsdjlb' + index">
        <gzsdjlb ref="gzsdjlb" :excel-id="item" :page="index" :syType="form.syType"></gzsdjlb>
      </div>
      <div v-show="activeVal === 'hdjlb'" v-for="(item, index) in excelTypeMap['hdjlb']" :key="'hdjlb' + index">
        <hdjlb ref="hdjlb" :excel-id="item" :page="index" :syType="form.syType"></hdjlb>
      </div>
      <div v-show="activeVal === 'hdxywzxjlb'" v-for="(item, index) in excelTypeMap['hdxywzxjlb']"
        :key="'hdxywzxjlb' + index">
        <hdxywzxjlb ref="hdxywzxjlb" :excel-id="item" :page="index" :syType="form.syType"></hdxywzxjlb>
      </div>
      <div v-show="activeVal === 'lmysdjlb'" v-for="(item, index) in excelTypeMap['lmysdjlb']"
        :key="'lmysdjlb' + index">
        <lmysdjlb ref="lmysdjlb" :excel-id="item" :page="index" :syType="form.syType"></lmysdjlb>
      </div>
      <div v-show="activeVal === 'mcxsjlb'" v-for="(item, index) in excelTypeMap['mcxsjlb']" :key="'mcxsjlb' + index">
        <mcxsjlb ref="mcxsjlb" :excel-id="item" :page="index" :syType="form.syType" @getDetailList="getDetailList">
        </mcxsjlb>
      </div>
      <div v-show="activeVal === 'pzdjlb'" v-for="(item, index) in excelTypeMap['pzdjlb']" :key="'pzdjlb' + index">
        <pzdjlb ref="pzdjlb" :excel-id="item" :page="index" :syType="form.syType" @getDetailList="getDetailList">
        </pzdjlb>
      </div>
      <div v-show="activeVal === 'ssxsjlb'" v-for="(item, index) in excelTypeMap['ssxsjlb']" :key="'ssxsjlb' + index">
        <ssxsjlb ref="ssxsjlb" :excel-id="item" :page="index" :syType="form.syType"></ssxsjlb>
      </div>
      <div v-show="activeVal === 'wcjlb'" v-for="(item, index) in excelTypeMap['wcjlb']" :key="'wcjlb' + index">
        <wcjlb ref="wcjlb" :excel-id="item" :page="index" :syType="form.syType"></wcjlb>
      </div>
      <div v-show="activeVal === 'gzsdbg'" v-for="(item, index) in excelTypeMap['gzsdbg']" :key="'gzsdbg' + index">
        <gzsdbg ref="gzsdbg" :excel-id="item" :page="index" :syType="form.syType" @getDetailList="getDetailList">
        </gzsdbg>
      </div>
      <div v-show="activeVal === 'hdbg'" v-for="(item, index) in excelTypeMap['hdbg']" :key="'hdbg' + index">
        <hdbg ref="hdbg" :excel-id="item" :page="index" :syType="form.syType" @getDetailList="getDetailList"></hdbg>
      </div>
      <div v-show="activeVal === 'hdxywzxbg'" v-for="(item, index) in excelTypeMap['hdxywzxbg']"
        :key="'hdxywzxbg' + index">
        <hdxywzxbg ref="hdxywzxbg" :excel-id="item" :page="index" :syType="form.syType"></hdxywzxbg>
      </div>
      <div v-show="activeVal === 'lmysdbg'" v-for="(item, index) in excelTypeMap['lmysdbg']" :key="'lmysdbg' + index">
        <lmysdbg ref="lmysdbg" :excel-id="item" :page="index" :syType="form.syType" @getDetailList="getDetailList">
        </lmysdbg>
      </div>
      <div v-show="activeVal === 'mcxsbg'" v-for="(item, index) in excelTypeMap['mcxsbg']" :key="'mcxsbg' + index">
        <mcxsbg ref="mcxsbg" :excel-id="item" :page="index" :syType="form.syType">
        </mcxsbg>
      </div>
      <div v-show="activeVal === 'pzdbg'" v-for="(item, index) in excelTypeMap['pzdbg']" :key="'pzdbg' + index">
        <pzdbg ref="pzdbg" :excel-id="item" :page="index" :syType="form.syType"></pzdbg>
      </div>
      <div v-show="activeVal === 'ssxsbg'" v-for="(item, index) in excelTypeMap['ssxsbg']" :key="'ssxsbg' + index">
        <ssxsbg ref="ssxsbg" :excel-id="item" :page="index" :syType="form.syType"></ssxsbg>
      </div>
      <div v-show="activeVal === 'wcbg'" v-for="(item, index) in excelTypeMap['wcbg']" :key="'wcbg' + index">
        <wcbg ref="wcbg" :excel-id="item" :page="index" :syType="form.syType" @getDetailList="getDetailList"></wcbg>
      </div>
      <div v-show="activeVal === 'ysdgsfbg'" v-for="(item, index) in excelTypeMap['ysdgsfbg']"
        :key="'ysdgsfbg' + index">
        <ysdgsfbg ref="ysdgsfbg" :excel-id="item" :page="index" :syType="form.syType"
          @getDetailListByJl="getDetailListByJl">
        </ysdgsfbg>
      </div>
      <div v-show="activeVal === 'ysdgsfjlb'" v-for="(item, index) in excelTypeMap['ysdgsfjlb']"
        :key="'ysdgsfjlb' + index">
        <ysdgsfjlb ref="ysdgsfjlb" :excel-id="item" :page="index" :syType="form.syType"></ysdgsfjlb>
      </div>
      <div v-show="activeVal === 'pzdsmzc'" v-for="(item, index) in excelTypeMap['pzdsmzc']"
        :key="'pzdsmzc' + index">
        <pzdsmzc ref="pzdsmzc" :excel-id="item" :page="index" :syType="form.syType"></pzdsmzc>
      </div>
      <div v-show="activeVal === 'pzdsmzcbg'" v-for="(item, index) in excelTypeMap['pzdsmzcbg']"
        :key="'pzdsmzcbg' + index">
        <pzdsmzcbg ref="pzdsmzcbg" :excel-id="item" :page="index" :syType="form.syType" :activeVal="activeVal"></pzdsmzcbg>
      </div>
      <div v-show="activeVal === 'ysdhdfjlb'" v-for="(item, index) in excelTypeMap['ysdhdfjlb']"
           :key="'ysdhdfjlb' + index">
        <ysdhdfjlb ref="ysdhdfjlb" :excel-id="item" :page="index" :syType="form.syType" :activeVal="activeVal"></ysdhdfjlb>
      </div>
      <div v-show="activeVal === 'ysdhdfbg'" v-for="(item, index) in excelTypeMap['ysdhdfbg']"
           :key="'ysdhdfbg' + index">
        <ysdhdfbg ref="ysdhdfbg" :excel-id="item" :page="index" :syType="form.syType" :activeVal="activeVal"></ysdhdfbg>
      </div>

    </div>
    <backtop-view :sum="activeVal ? excelTypeMap[activeVal].length : 1" @onModPages="onModPages" />

    <statement-select-view ref="statementSelectView" :data-list="tabList" @onShowPreview="onShowPreview" />
    <statement-select-dialog ref="statementSelectDialog" />
  </div>
</template>

<script>
import Bus from "@/utils/bus";
import store from "@/store";
import { emptyConvert } from "@/views/reportForms/utils";
import { getBsDataReport, bsDataReportTb, bsDataReportModPages } from "@/api/syrw/bsDataReport";
import StatementSelectView from "@/views/reportForms/components/StatementSelectView.vue";
import StatementSelectDialog from "@/views/reportForms/components/StatementSelectDialog.vue";
export default {
  name: "index",
  components: {
    TopOperation: () => import("@/views/reportForms/components/topOperation"), // tab页
    BacktopView: () => import("@/views/reportForms/components/backtopView"), // 回到顶部页
    tdmdjlb: () => import("@/views/reportForms/tg/tdmdjlb"), // 土的密度记录表
    gzsdjlb: () => import("@/views/reportForms/ljlm/gzsdjlb"), //  路面构造深度试验检测记录表(手工铺砂法)
    hdjlb: () => import("@/views/reportForms/ljlm/hdjlb"), // 路基路面厚度测试试验检测记录表
    hdxywzxjlb: () => import("@/views/reportForms/ljlm/hdxywzxjlb"), // 路面厚度、芯样完整性试验检测记录表(钻芯法)
    lmysdjlb: () => import("@/views/reportForms/ljlm/lmysdjlb"), // 路面压实度试验检测记录表(钻芯法)
    mcxsjlb: () => import("@/views/reportForms/ljlm/mcxsjlb"), // 路面摩擦系数试验检测记录表(摆式仪法)
    pzdjlb: () => import("@/views/reportForms/ljlm/pzdjlb"), // 路基路面平整度试验检测记录表(连续式平整度仪)
    ssxsjlb: () => import("@/views/reportForms/ljlm/ssxsjlb"), // 路基路面渗水系数试验检测记录表
    wcjlb: () => import("@/views/reportForms/ljlm/wcjlb"), // 贝克曼梁测定回弹弯沉试验检测记录表
    gzsdbg: () => import("@/views/reportForms/ljlm/gzsdbg"), // 路面构造深度试验检测报告
    hdbg: () => import("@/views/reportForms/ljlm/hdbg"), // 路基路面厚度测试试验检测报告
    hdxywzxbg: () => import("@/views/reportForms/ljlm/hdxywzxbg"), // 路面厚度、芯样完整性试验检测报告(钻芯法)
    lmysdbg: () => import("@/views/reportForms/ljlm/lmysdbg"), // 路面压实度试验检测报告(钻芯法)
    mcxsbg: () => import("@/views/reportForms/ljlm/mcxsbg"), // 路面摩擦系数试验检测报告
    pzdbg: () => import("@/views/reportForms/ljlm/pzdbg"), // 路基路面平整度试验检测报告(连续式平整度仪)
    ssxsbg: () => import("@/views/reportForms/ljlm/ssxsbg"), // 路基路面渗水系数试验检测报告
    wcbg: () => import("@/views/reportForms/ljlm/wcbg"), // 贝克曼梁测定回弹弯沉试验检测报告
    ysdgsfbg: () => import("@/views/reportForms/ljlm/ysdgsfbg"), // 路基路面压实度试验检测报告(灌砂法)
    ysdgsfjlb: () => import("@/views/reportForms/ljlm/ysdgsfjlb"), // 路基路面压实度试验检测记录表(灌砂法)
    pzdsmzc: () => import("@/views/reportForms/ljlm/pzdsmzc"), // 路基路面平整度试验检测记录（三米直尺法)
    pzdsmzcbg: () => import("@/views/reportForms/ljlm/pzdsmzcbg"), // 路基路面平整度试验检测报告（三米直尺法)
    ysdhdfjlb: () => import("@/views/reportForms/ljlm/ysdhdfjlb"), // 压实度试验检测记录表（环刀法）
    ysdhdfbg: () => import("@/views/reportForms/ljlm/ysdhdfbg"), // 压实度试验检测报告表（环刀法）
    StatementSelectView,
    StatementSelectDialog
  },
  data () {
    return {
      reportId: undefined,
      tabList: [],
      form: {
        syType: "",
        excelTypeList: {}
      },
      activeVal: "",
      // key为excelTypeId， value为 excelId数组
      excelTypeMap: {},
      modPagesLodding: false
    };
  },
  watch: {
    'activeVal' (val, oldVal) {
      if (val && oldVal) {
        this.reportFormsSubmit(false);
      };
    }
  },
  created () {
    if (this.$route.query) {
      this.reportId = this.$route.query.reportId;
    }
    this.init();
  },
  mounted () {
    // 填充特殊符号
    Bus.$on("setCharacter", (data) => {
      const { focusInput, page } = store.state.reportForms;
      this.$refs[this.activeVal][page].form[focusInput] = this.$refs[this.activeVal][page].form[focusInput] || "" + data;
    });
  },
  beforeDestroy () {
    // 停止监听事件
    Bus.$off("setCharacter");
  },
  methods: {
    // 获取记录表和报告表
    async init () {
      if (!this.reportId) {
        this.$message.error("报告id不能为空");
        return;
      }
      const response = await getBsDataReport(this.reportId);
      this.form = response.data;
      if (!this.form.excelTypeList || this.form.excelTypeList.length == 0) {
        this.tabList = [
          {
            val: undefined,
            name: undefined,
            excelId: undefined,
            excelTypeId: undefined
          }
        ];
        return;
      }
      let tabList = [];
      this.excelTypeMap = {};
      this.form.excelTypeList.forEach((item) => {
        // 是否包含label
        if (this.excelTypeMap.hasOwnProperty(item.label)) {
          this.excelTypeMap[item.label].push(item.excelId);
        } else {
          this.excelTypeMap[item.label] = [item.excelId];
          tabList.push({
            val: item.label,
            name: item.excelTypeName,
            excelId: item.excelId,
            excelTypeId: item.excelTypeId
          });
        }
      });
      this.tabList = tabList;
      this.$set(this.tabList, tabList);
      if (!this.activeVal) {
        this.activeVal = this.tabList[0].val;
      }
      // this.currentActive(this.activeVal)
    },
    currentActive (val) {
      this.activeVal = val;
    },
    // 批量提交
    async reportFormsSubmit (hasTips = true) {
      let arr = [];
      this.tabList.forEach((item) => {
        const refList = this.excelTypeMap[item.val];
        if (!refList || refList.length <= 0) {
          return;
        }
        refList.forEach((element, index) => {
          if (this.$refs[item.val] && this.$refs[item.val][index]) {
            let info = this.$refs[item.val][index].submitForm();
            // arr.push({ label: item.val, excelObj: info });
            arr.push({ label: item.val, excelObj: emptyConvert(JSON.parse(JSON.stringify(info))) });
          }
        });
      });
      await bsDataReportTb(arr);
      if (hasTips) {
        this.$modal.msgSuccess("操作成功");
      };
    },
    // 加一页减一页
    async onModPages (modType) {
      this.modPagesLodding = true;
      // 1先保存
      await this.reportFormsSubmit();
      // 加减页时同时处理报告
      const activeArr = ['gzsdbg', 'gzsdjlb', 'hdbg', 'hdjlb', 'lmysdjlb', 'lmysdbg', 'pzdjlb', 'pzdbg', 'mcxsjlb', 'mcxsbg', 'wcjlb', 'wcbg'];
      if (activeArr.includes(this.activeVal)) {
        const count = this.activeVal.includes('jlb') ? 3 : 2;
        // 取最后两个字符
        const newVal = this.activeVal.substring(0, this.activeVal.length - count);
        const lastTwo = this.activeVal.substring(this.activeVal.length - count);
        const newActiveVal = newVal + (lastTwo == 'bg' ? 'jlb' : 'bg');
        await this.doModPages(modType, newActiveVal);
      }
      // 2 加减页
      await this.doModPages(modType, this.activeVal);
      // 3 重新加载
      await this.init();
      // 4 刷新
      this.tabList.forEach((item) => {
        const refList = this.excelTypeMap[item.val];
        if (!refList || refList.length <= 0) {
          return;
        }
        refList.forEach((element, index) => {
          if (this.$refs[item.val] && this.$refs[item.val][index]) {
            this.$refs[item.val][index].getInfo();
          }
        });
      });
      this.modPagesLodding = false;
    },
    // 加减页
    async doModPages (modType, activeVal) {
      const arr = this.excelTypeMap[activeVal];
      const data = {
        reportId: this.reportId,
        label: activeVal,
        modType: modType,
        excelId: Number(modType) < 0 ? arr[arr.length - 1] : undefined
      };
      await bsDataReportModPages(data);
    },
    // 选择报表
    onPrintSpecificPart () {
      this.$refs.statementSelectView.init();
    },
    //预览
    onShowPreview (tableList) {
      if (!tableList || tableList.length <= 0) {
        return;
      }
      let arr = [];
      this.form.excelTypeList.forEach((item) => {
        if (tableList.includes(item.label)) {
          arr.push({ label: item.label, excelId: item.excelId, syType: this.form.syType, typeSort: item.excelIndex });
        }
      });
      this.$refs.statementSelectDialog.init(arr);
    },
    // 获取该报告下所有页码data数据
    getDetailList (type) {
      const refList = this.excelTypeMap[type];
      if (!refList || refList.length <= 0) {
        return;
      }
      let arr = [];
      refList.forEach((element, index) => {
        if (this.$refs[type][index]) {
          const detailList = this.$refs[type][index].form.detailList;
          arr = [...arr, ...detailList];
        }
      });
      this.$refs[type][0].calculateBg(arr);
    },
    //  多对一 读取记录表数据合并到报告 type为报告名
    getDetailListByJl (type) {
      const jlbVal = this.activeVal.substring(0, type.length - 2) + 'jlb';
      const refList = this.excelTypeMap[jlbVal];
      if (!refList || refList.length <= 0) {
        return;
      }
      let arr = [];
      refList.forEach((element, index) => {
        if (this.$refs[jlbVal][index]) {
          const detailList = this.$refs[jlbVal][index].getBgData();
          arr = [...arr, ...detailList];
        }
      });
      this.$refs[type][0].calculateBg(arr);
    }
  }
};
</script>

<style scoped></style>
